<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>美食天下</title>
    <!-- 调用css全局样式开始 -->
    <link rel="stylesheet" href="css/style.css">
</head>

<body>
    <!-- 顶部导航菜单开始 -->
    <div class="header">
        <div class="inner">
            <div class="logo">
                <a href="#"><img src="images/logo.png" /></a>
            </div>
            <div class="nav">
                <ul>
                    <li>
                        <a href="index.html">首页</a>
                    </li>
                    <li>
                        <a href="cp.html">菜谱</a>
                        <ul>
                            <li><a href="cp.html">名菜</a></li>
                            <li><a href="xx.html">内页</a></li>
                        </ul>
                    </li>
                    <li>
                        <a href="sc.html">食材</a>
                    </li>
                    <li>
                        <a href="zx.html">珍选</a>
                    </li>
                    <li>
                        <a href="jj.html">舌尖上的中国</a>
                        <ul>
                            <li><a href="jj.html">栏目简介</a></li>
                            <li><a href="zh.html">中华名吃</a></li>
                            <li><a href="df.html">地方美食</a></li>
                        </ul>
                    </li>
                    <li>
                        <a href="jk.html">健康饮食</a>
                    </li>
                    <li>
                        <a href="zc.html">注册登录</a>
                        <ul>
                            <li><a href="zc.html">注册</a></li>
                            <li><a href="dl.html">登录</a></li>
                        </ul>
                    </li>
                    <li>
                        <a href="ly.html">留言中心</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 顶部导航菜单结束 -->
    <div class="main-z clearfix">
        <div class="articel">
            <!-- 轮播图开始 -->
            <div class="ad" id="box">
                <div class="screen">
                    <!--相框-->
                    <ul>
                        <li><img src="images/banner1.jpg" /></li>
                        <li><img src="images/banner2.jpg" /></li>
                        <li><img src="images/banner3.jpg" /></li>
                    </ul>
                    <ol>
                    </ol>
                </div>
                <div id="arr"><span id="left">&lt;</span><span id="right">&gt;</span></div>
            </div>
            <!-- 调用轮播图用的js -->
            <script src="js/ad.js"></script>
            <!-- 轮播图结束 -->
        </div>
        <div class="aside">
            <!-- banner右边部分开始 -->
            <div class="ses">
                <div class="ses-bd">
                    <ul>
                        <li>
                            <a href="xx.html">
                            <img src="images/zz1.jpg">
                            <h3>南瓜鸡蛋螺丝粉</h3>
                            </a>
                        </li>
                        <li>
                            <a href="xx.html">
                            <img src="images/zz2.jpg">
                            <h3>菲力牛排</h3>
                            </a>
                        </li>
                        <li>
                            <a href="xx.html">
                            <img src="images/zz3.jpg">
                            <h3>酸菜炒鸡肚</h3>
                            </a>
                        </li>
                        <li>
                            <a href="xx.html">
                            <img src="images/zz4.jpg">
                            <h3>肥牛饭</h3>
                            </a>
                        </li>
                        <li>
                            <a href="xx.html">
                            <img src="images/zz5.jpg">
                            <h3>西红柿炒菜花</h3>
                            </a>
                        </li>
                        <li class="yingxiao">
                            <a href="xx.html">
                            <img src="images/zz6.jpg">
                            <h3>西兰花虾仁</h3>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!-- 关于我们，开始 -->
    <div class="case">
        <div class="ses-hd">
            <h3>
            <img src="images/xd.jpg">
          </h3>
        </div>
        <div class="aboutus">
            <p>在美食天下你可以认识食材、学习菜谱。从小白到大咖，然后脑洞大开技惊全场；或者挑战烘焙，甜蜜满屋。人人都是美食家，欢迎你参与进来——这里的菜谱都是由你我他创建，欢迎分享出你的拿手菜！</p>
            <p>也可以发表话题，跟大家一起交流厨艺、分享家人的早餐、吃到的美食，以及关于生活的各种美好。你也可以将喜爱的菜谱，创建各种菜单，这是属于大家的知识专辑。每一次参与，都是帮助他人。</p>
        </div>
        <div class="case-bd clearfix">
            <ul>
                <li>
                    <a href="xx.html">
                    <img src="images/ric1.jpg">
                    <div class="text">糖醋排骨</div>
                    <div class="mask"></div>
                    </a>
                </li>
                <li>
                    <a href="xx.html">
                    <img src="images/ric2.jpg">
                    <div class="text">红烧肉</div>
                    <div class="mask"></div>
                    </a>
                </li>
                <li>
                    <a href="xx.html">
                    <img src="images/ric3.jpg">
                    <div class="text">可乐鸡翅</div>
                    <div class="mask"></div>
                    </a>
                </li>
                <li>
                    <a href="xx.html">
                    <img src="images/ric4.jpg">
                    <div class="text">腊肉冬瓜</div>
                    <div class="mask"></div>
                    </a>
                </li>
                <li>
                    <a href="xx.html">
                    <img src="images/ric5.jpg">
                    <div class="text">枸杞鸡肉</div>
                    <div class="mask"></div>
                    </a>
                </li>
                <li>
                    <a href="xx.html">
                    <img src="images/ric6.jpg">
                    <div class="text">金针菇炒肉</div>
                    <div class="mask"></div>
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <!-- 热门目的地，结束 -->
    <!-- 版权开始 -->
    <div class="footer">
        <p>copyright ©2020 美食天下 版权所有 All Rights Reserved.</p>
        <p>联系电话:13900000000 邮箱地址:123456789@qq.com</p>
    </div>
</body>

</html>